<template>
	<view class="center-page">
		<view class="top">
			<image class="avatar" :src="pic" size="140"></image>
			<view class="text">
				<view class="name">固定账号</view>
				<view class="desc">每天学一点，每周一进步，每月一记录</view>
			</view>
		</view>
		<wd-cell-group border>
			<wd-cell icon="download1" title="导出记事本" is-link @click="onNoteCopy"></wd-cell>
			<wd-cell icon="upload" title="导入记事本" is-link @click="onNoteImport"></wd-cell>
			<!-- <wd-cell icon="file" title="发票" is-link></wd-cell> -->
			<wd-cell icon="spool" title="当前版本" value="1.1.0" ></wd-cell>
		</wd-cell-group>
	</view>
</template>

<script lang="ts" setup>
	import { ref } from 'vue';
	import { useNoteStore } from '@/stores/note';
	import { Note } from '@/types/note';
	const note = useNoteStore()//缓存

	const pic = ref('https://uviewui.com/common/logo.png')
	
	/** 记事本-导出*/
	function onNoteCopy(){
		uni.setClipboardData({
			data:JSON.stringify(note.noteList),
			success: function (res) {
				console.log(res)
				uni.showToast({
					icon:'none',
					title:'记事本内容已复制到剪贴板'
				})
			}
		});
	}
	
	/** 记事本-导入*/
	function onNoteImport(){
		uni.navigateTo({
			url:"/pages/note/import"
		})
	}
</script>

<style lang="scss" scoped>
	.center-page {
		padding-top: var(--status-bar-height);

		page {
			background-color: #ededed;
		}

		.top {
			display: flex;
			margin-bottom: 20rpx;
			padding: 30rpx;
			background-color: #fff;

			.avatar {
				margin-right: 20rpx;
				width: 140rpx;
				height: 140rpx;
			}

			.name {
				margin-bottom: 20rpx;
				font-size: 36rpx;
			}

			.desc {
				font-size: 28rpx;
				color: #909399;
			}
		}


	}
</style>